<template>
	<view class="Lu-fankui-box">
		<view class="Lu-fankui-wenti">
			<view class="Lu-fankui-wentitit">
				<b>问题和意见</b>
			</view>
			<textarea class="Lu-fankui-wenticon" v-model="fankuicontent" placeholder="简要描述您要反馈的问题和建议" />
		</view>
		
		<view class="Lu-fankui-top">
			
		</view>
		<!-- <input type="text" placeholder="简要描述您要反馈的问题和建议"> -->
		<view class="Lu-fankui-lianxi">
			<view class="Lu-fankui-lianxitit">
				<b>联系方式</b> 	
			</view>
			<input class="Lu-fankui-lianxiphone" v-model="fankuiphone" type="number" placeholder="请留下您的联系手机号，方便联系您	">
		</view>
		
		<view class="Lu-fankui-submit" @click="submitfankui" :class="{ 'active':fankuicontent != '' && fankuiphone!=''}">
			<b>提交</b>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import md5 from 'js-md5';
	export default {
		computed: {
			...mapState(['hasLogin','userInfo','openId','apiUrl'])
		},
		data() {
			return {
				fankuicontent:'',
				fankuiphone:'',
				
			}
			
		},
		methods:{
			submitfankui:function(){
				console.log(this.fankuicontent)
				console.log(this.fankuiphone)
				var _this = this
				if(this.fankuicontent =='' || this.fankuiphone ==''){
					uni.showModal({
					    title: '请输入意见或联系方式',
					    content: '请输入意见或联系方式',
					    success: function (res) {
					        if (res.confirm) {
					           
					        } else if (res.cancel) {
					            
					        }
					    }
					})
				}else{
					uni.request({
						url:this.apiUrl+'api/post_feedback',
						method:"POST",
						header:{
							openid:this.openId
						},
						data:{
							content:this.fankuicontent,
							title:this.fankuicontent,
							phone:this.fankuiphone,
							type:'1'
						},
						success: (res) => {
							uni.showModal({
							    title: res.data.msg,
							    content: res.data.msg,
							    success: function (res) {
									console.log( _this.fankuicontent)
									
							        _this.fankuicontent = ''
									_this.fankuiphone = ''
							    }
							})
						}
						
					})
				}
				
			}
		
		}
	}
</script>

<style lang="scss">
	.Lu-fankui-box{
		.Lu-fankui-top{
			width: 100%;
			height: 20rpx;
			background-color: #f5f5f5;
		}
		.Lu-fankui-wenti{
			padding: 50rpx;
			.Lu-fankui-wentitit{
				font-size: 30rpx;
				color: #333333;
			}
			.Lu-fankui-wenticon{
				color: #666666;
				font-size: 24rpx;
				width: 100%;
				margin-top: 32rpx;
			}
		}
		.Lu-fankui-lianxi{
			padding: 50rpx;
			.Lu-fankui-lianxitit{
				font-size: 30rpx;
				color: #333333;
			}
			.Lu-fankui-lianxiphone{
				color: #666666;
				font-size: 24rpx;
				width: 100%;
				margin-top: 20rpx;
				border-bottom: 2rpx solid #e5e5e5;
				padding: 30rpx 0;
			}
		}
		.Lu-fankui-submit{
			position: fixed;
			bottom: 0;
			width: 100%;
			text-align: center;
			height: 120rpx;
			background-color: #cfd5e3;
			line-height: 120rpx;
			color: #ffffff;
		}
		.active{
			background-color: #3e87fe;
		}
	}
</style>